<template>
	<view class="order-item">
    <view class="order-top">
      <view class="order-no">订单编号：1584569878954215</view>
      <view class="order-status-1">进行中</view>
    </view>
    <view class="good-box">
      <image src="https://file.genepre.com/wechat/caijiqi2_new.png" mode="aspectFill" class="good-img"></image>
      <view class="good-info">
        <view class="good-title">
          仪器共享订单仪器共享订单仪器共享订单仪器共享订单仪器共享订单仪器共享订单仪器共享订单仪器共享订单仪
		  器共享订单仪器共享订单
        </view>
        <view class="good-bottom">
          <view class="attr">
            压路机 共享
          </view>
          <view class="good-price">
            ¥358
          </view>
        </view>
      </view>
    </view>
		<!--实付-->
		<view class="real-pay">
			<view class="attr">
				实付
			</view>
			<view class="good-price">
				¥{{358}}
			</view>
		</view>
		<view class="order-bottom">
			<!--待付款-->
		<!-- 	<view class="need-pay" v-if="orderStatus == 0">
				付款 ¥{{orderInfo.total_amount}}
			</view> -->
			<!--待成团-->
<!--			<view class="invite-user" v-if="orderStatus == 1">
				<view class="down-time" v-if="">
					<timer :endTime="orderInfo.pin_remain_time" :orderList="isOrderList"></timer>
				</view>
				<button open-type="share" :id="orderInfo.order_id" :data-index="index" class="invite-btn">邀请拼单</button>
			</view>-->
			<!--待收货-->
			<view class="wait-express">
				<view class="view-express" @tap="viewExpress">
					查看物流
				</view>
				<view class="view-express" @tap="sureReceipt">
					确认收货
				</view>
			</view>
			<!--待收货-->
<!--			<view class="wait-express" v-else-if="orderStatus == 4">
				<view class="view-express" @tap="applyAfterSale" v-if="orderInfo.isCanApplyAfterSales">
					申请售后
				</view>
				<view class="view-express" @tap="viewExpress">
					查看物流
				</view>
			</view>
			&lt;!&ndash;已完成&ndash;&gt;
			<view class="has-success" @tap="buyOnceMore" v-else-if="orderStatus == 10">
				再次购买
			</view>
			&lt;!&ndash;取消&ndash;&gt;
			<view class="has-cancel" @tap="buyOnceMore" v-else-if="orderStatus < 0 || orderStatus == 9">
				再次购买
			</view>
			<view class="has-success" @tap="buyOnceMore" v-else-if="orderInfo.pinUserOrderType != 3">
				再次购买
			</view>
		</view>
		<view class="order-bottom" v-else-if="orderStatus==3||orderStatus==4">
			&lt;!&ndash;待收货&ndash;&gt;
			<view class="wait-express" v-if="orderStatus == 3">
				<view class="view-express" @tap="viewExpress">
					查看物流
				</view>
				<view class="view-express" @tap="sureReceipt">
					确认收货
				</view>
			</view>
			&lt;!&ndash;待收货&ndash;&gt;
			<view class="wait-express" v-else-if="orderStatus == 4">
				<view class="view-express" @tap="viewExpress">
					查看物流
				</view>
			</view>
		</view>-->
	</view>
	</view>
</template>

<script>
	//import timer from '../common/timer.vue'

	export default {
		props: {
      nomsg: 'https://file.genepre.com/wechat/nomsg_new.png',
			orderInfo: {
				type: Object,
				default: {}
			},
			index: Number
		},
		data() {
			return {
				isOrderList: true
			}
		},
		onShareAppMessage(e) {
			console.log(e)
		},
		/*components: {
			timer
		},*/
		methods: {
			// 跳转订单详情
			clickOrder() {
				uni.navigateTo({
					url: '../../pages/order/detail?orderId=' + this.orderInfo.order_id
				})
			},
			// 再次购买
			buyOnceMore() {
				uni.navigateTo({
					url: '../detail/detail?goodsId=' + this.orderInfo.goods_id
				})
			},
			// 查看物流
			viewExpress() {
				uni.navigateTo({
					url: '../../pages/order/express?orderId=' + this.orderInfo.order_id
				})
			},
			// 确认收货
			sureReceipt() {
				let _this = this;
				uni.showModal({
					content: '确认已经收货?',
					success: function(res) {
						if (res.confirm) {
							_this.$http.post('confirmGoods', {
								order_id: _this.orderInfo.order_id
							}).then(([err, res]) => {
								if (res.data.code == 1) {
									_this.$common.toast('感谢您的支持', 1000, () => {
										_this.$emit('updateOrderInfo', _this.index)
									})
								} else {
									_this.$common.toast(res.data.msg, 1000)
								}
							})
						}
					},
					fail: function(fail) {
						console.log(fail)
					}
				})

			},
			// 申请售后
			applyAfterSale() {
				uni.navigateTo({
					url: './afterSale?orderId=' + this.orderInfo.order_id
				})
			},
			//拼团成功的人有资格购买88的红酒
			buyWine(e) {
				const pinOrderId = e.currentTarget.dataset.id
				const goodsId = getApp().globalData.wineGoodsId
				
				uni.navigateTo({
					url:'/pages/detail/redWine?pinParentUserOrderId='+pinOrderId+'&goodsId='+goodsId
				})
			}
		},
		computed: {
			// 属性字符串
			attrStr() {
				let attrData = this.orderInfo.attrData;
				let attrArr = [];
				if (attrData && attrData.length > 0) {
					attrData.map(item => {
						attrArr.push(item.attr_value)
					})
					return attrArr.join(' ')
				}
				return ''
			},
			// 订单状态
			orderStatus() {
				//return this.orderInfo.pay_status
				return 3
			},
			statusText() {
				let orderInfo = this.orderInfo
				let pay_status = orderInfo.pay_status
				if (pay_status == 1) {
					return '拼团中'
				} else if (pay_status == 2) {
					return '待发货';
				} else if (pay_status == 3) {
					return '待收货';
				} else if (pay_status == 4) {
					return '已收货';
				} else if (pay_status == 5) {
					return '已申请售后'
				} else if (pay_status == 9) {
					return '未拼中'
				} else if (pay_status == 10) {
					return '已完成'
				} else if (pay_status == -1) {
					return '已取消';
				} else if (pay_status == -2 || pay_status == -3) {
					return '系统取消';
				} else {
					return '已完成'
				}
			}
		}
	}
</script>

<style lang="scss">
	.order-item {
		width: 750rpx;
		min-height: 450rpx;
		max-height: 630rpx;
		background: #FFFFFF;
		opacity: 1;
		display: flex;
		flex-direction: column;
		justify-content: space-between;
		align-items: center;
		border-top: 24rpx solid #F5F6F9;
		position: relative;
		.real-pay {
			width: 446rpx;
			height: 60rpx;
			align-self: flex-end;
			display: flex;
			justify-content: space-between;
			align-items: center;
			font-size: 28rpx;
			font-family: PingFang SC;
			font-weight: 500;
			color: #0C0900;
			opacity: 1;
			padding-right: 40rpx;
			box-sizing: content-box;
			.good-price {
				font-size: 36rpx;
				font-weight: bold;
			}
		}
	}

	.order-item .order-top {
		width: 670rpx;
		height: 90rpx;
		display: flex;
		justify-content: space-between;
		align-items: center;
	}

	.order-top .order-no {
		height: 44rpx;
		font-size: 24rpx;
		font-family: PingFang SC;
		font-weight: 500;
		line-height: 44rpx;
		color: #686661;
		opacity: 1;
	}

	.order-top .order-status-0 {
		font-size: 28rpx;
		font-family: PingFang SC;
		font-weight: bold;
		color: #F86341;
		opacity: 1;
	}

	.order-top .order-status-10,
	.order-top .order-status-1 {
		font-size: 32rpx;
		font-family: PingFang SC;
		font-weight: bold;
		color: #0C0900;
		opacity: 1;
	}

	.order-top .order-status-3 {
		font-size: 32rpx;
		font-family: PingFang SC;
		font-weight: 500;
		line-height: 44rpx;
		color: #B2B1AE;
		opacity: 1;
	}

	.order-item .good-box {
		width: 670rpx;
		height: 230rpx;
		display: flex;
		justify-content: space-between;
		align-items: center;
	}

	.order-item .good-box .good-img {
		width: 200rpx;
		height: 200rpx;
		opacity: 1;
		border-radius: 16rpx;
	}

	.good-box .good-info {
		width: 446rpx;
		height: 200rpx;
		display: flex;
		flex-direction: column;
		justify-content: space-between;
		align-items: center;
	}

	.good-info .good-title {
		width: 446rpx;
		height: 88rpx;
		font-size: 32rpx;
		font-family: PingFang SC;
		font-weight: bold;
		line-height: 44rpx;
		color: #000000;
		opacity: 1;
		overflow: hidden;
		text-overflow: ellipsis;
		display: -webkit-box;
		-webkit-box-orient: vertical;
		-webkit-line-clamp: 2;
	}

	.good-info .good-bottom {
		width: 100%;
		height: 50rpx;
		display: flex;
		justify-content: space-between;
		align-items: center;
	}

	.good-info .good-bottom .attr {
		width: 260rpx;
		font-size: 28rpx;
		font-family: PingFang SC;
		font-weight: 500;
		line-height: 40rpx;
		color: #686661;
		opacity: 1;
		overflow: hidden;
		text-overflow: ellipsis;
		display: -webkit-box;
		-webkit-line-clamp: 1;
		-webkit-box-orient: vertical;
	}

	.good-info .good-bottom .good-price {
		height: 50rpx;
		font-size: 32rpx;
		font-family: PingFang SC;
		font-weight: 400;
		line-height: 50rpx;
		color: #0C0900;
		opacity: 1;
	}

	.order-item .order-bottom {
		width: 670rpx;
		flex: 1 0 128rpx;
		display: flex;
		justify-content: flex-end;
		align-items: center;
		border-top: 2rpx solid #E7E9EE;
		margin-top: 20rpx;
		position: relative;
		bottom: 0;
		z-index: 99;
	}

	.need-pay {
		width: 180rpx;
		height: 64rpx;
		background: #F86341;
		opacity: 1;
		border-radius: 32rpx;
		font-size: 28rpx;
		font-family: PingFang SC;
		font-weight: 500;
		color: #FFFFFF;
		opacity: 1;
		display: flex;
		justify-content: center;
		align-items: center;
	}
	/**
	 * 超值大礼包
	 */
	.buy-wine {
		width: 100%;
		color: #F86341;
		display: flex;
		justify-content: center;
		align-items: center;
		transform: translateY(-45%);
		.wine-img {
			width: 686rpx;
			height: 136rpx;
		}
	}
	/**
	 * 邀请参团
	 */
	.order-bottom .invite-user {
		display: flex;
	}

	.invite-btn {
		width: 180rpx;
		height: 64rpx;
		background: #FFFFFF;
		border: 2rpx solid #F86341;
		opacity: 1;
		border-radius: 32rpx;
		font-size: 28rpx;
		font-family: PingFang SC;
		font-weight: 500;
		color: #F86341;
		opacity: 1;
		display: flex;
		align-items: center;
		justify-content: center;
		margin-left: 20rpx;
		margin-top: -8rpx;
		z-index: 999;
	}

	/**
	 * 待收货
	 */
	.order-bottom .wait-express {
		display: flex;
	}

	.wait-express .view-express {
		width: 180rpx;
		height: 64rpx;
		background: #FFFFFF;
		border: 2rpx solid #E7E9EE;
		opacity: 1;
		border-radius: 32rpx;
		margin: 0 16rpx;
		display: flex;
		justify-content: center;
		align-items: center;
	}

	/**
	 * 已完成
	 */
	.has-success,
	.has-cancel {
		width: 180rpx;
		height: 64rpx;
		background: #FFFFFF;
		border: 2rpx solid #E7E9EE;
		opacity: 1;
		border-radius: 32rpx;
		font-size: 28rpx;
		font-family: PingFang SC;
		font-weight: 500;
		color: #686661;
		opacity: 1;
		display: flex;
		justify-content: center;
		align-items: center;
		z-index: 999;
	}
</style>